import React, { memo, Suspense } from 'react';
//共享store
import { Provider } from "react-redux";
import { HashRouter } from "react-router-dom";

import SetRoutes from "./router";
import store from "./store";

import MyAppHeader from "./components/app-header";
import MyAppFooter from "./components/app-footer";
import MyPlayerBar from './pages/player/app-player-bar';

const App = memo(() => {
  return (
    <Provider store={store}>
      <HashRouter>
        <MyAppHeader />

        
        <Suspense fallback={<div>pages Loading......</div>}> {/* 路由未加载出来的站位,配合路由懒加载 */}
          {/* 路由展示位置 */}
          <SetRoutes />
        </Suspense>  

        <MyAppFooter />

        <MyPlayerBar />
      </HashRouter>
    </Provider>
  )
})

export default App